<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>结构层次</title>
    <style>
        /*ul li:first-child{*/
            /*background: #FF0000;*/
        /*}*/
        /*ul li:last-child{*/
            /*background: #1F87CC;*/
        /*}*/
        /*ul li:nth-child(2){*/
            /*background: #FAA53B;*/
        /*}*/
        /*table tr:nth-child(2){*/
            /*background: beige;*/
        /*}*/
        /*tr td:nth-child(2){*/
            /*background: antiquewhite;*/
        /*}*/
        /*tr td:nth-child(even){*/
            /*background: darkgray;*/
        /*}*/
        /*table tr:nth-child(odd){*/
            /*background: beige;*/
        /*}*/
        p:first-of-type{
            background: #FAA53B;
        }
        td:last-of-type{
            background: antiquewhite;
        }
        /*body>p:nth-of-type(1){*/
            /*background: aqua;*/
        /*}*/
        body>p:nth-child(1){
        background: aqua;
        }


    </style>

</head>

<!--选择器	功能描述-->
<!--E:first-child	作为父元素的第一个子元素的元素E-->
<!--E:last-child	作为父元素的最后一个子元素的元素E-->
<!--E F:nth-child(n)	选择父级元素E的第n个子元素F，（n可以是1、2、3），关键字为even、odd     even偶数行，odd奇数行-->
<!--E:first-of-type	选择父元素内具有指定类型的第一个E元素-->
<!--E:last-of-type	选择父元素内具有指定类型的最后一个E元素-->
<!--E F:nth-of-type(n)	选择父元素内具有指定类型的第n个F元素-->
<!--type 先看类型 再看位置-->


<body>
<span>dddd</span>
<p>1</p>
<p>2</p>
<p>
<ul>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>
</p>
<p>
    <ul>
        <li>6</li>
        <li>7</li>
        <li>8</li>
    </ul>
</p>
<p>
    <ul>
        <li>9</li>
        <li>10</li>
        <li>11</li>
    </ul>
</p>
<p>
    <ul>
        <li>12</li>
        <li>13</li>
        <li>14</li>
    </ul>
</p>

<p>
<table border="2">
    <tr>
        <td>111111</td>
        <td>222222</td>
        <td>333333</td>
    </tr>
    <tr>
        <td>111111</td>
        <td>222222</td>
        <td>333333</td>
    </tr>
    <tr>
        <td>111111</td>
        <td>222222</td>
        <td>333333</td>
    </tr>
    <tr>
        <td>121111</td>
        <td>222222</td>
        <td>333333</td>
    </tr>
    <tr>
        <td>122222</td>
        <td>211111</td>
        <td>333333</td>
    </tr>
</table>
</p>


</body>
</html>